Adding images
After you upload or copy images to a remote server, you can add them to items. Image width and several other factors determine whether images appear in a full pane or in an image pane. See Image layout options.
You cannot copy and paste images into an item. Although the image may display in your content, it will not appear to students viewing the item. Instead, follow the instructions below.
To add images:
- Upload or copy the file(s) to a server. File names cannot contain spaces.
- For files that are smaller than 1 MB, upload them as an asset of the item or copy them to a remote server.
- For files that are larger than 1 MB, copy them to a remote server.
- Place the cursor where you want the image to appear.
For larger images , or for images in Hints, answer instructions, or follow-up text, create a paragraph for the image and click the start of the paragraph.
- Click img from the entity window, or right-click and select Insert >img.
- Paste or enter the file name or URL for the image in the text entry field.
- [Optional] Assign image attributes.
Image attributes determine the layout of the image in the item. In most cases, choose middle to center the image. For images in paragraphs, you can either use the img attributes or the paragraph attributes of left, center, or right to position the image.
If you don't define image attributes, images in introductions, Parts, and transitions display:
- In the image pane, if the size is less than 501 pixels wide, or
- In a one-pane view if the size is greater than 501 pixels wide
- Preview the item.
Setting image attributes
The inline attributes you set for the img tag determine the placement of images, as shown below.
inline Attribute Value | Resulting image displays |
---|---|
No value, the field is blank (default) |
In the image pane if the width is less than 501 pixels. Right-justified in a single, full-screen pane if the image is greater than 500 pixels. |
middle | Inline with the text, aligned to the middle of the text. |
text-bottom |
Inline with the text, with the bottom of the image aligned to the lowest text. |
text-top | Inline with the text, with the top of the image aligned to the tallest text. |
baseline | Inline with the text, with the image positioned on the baseline of the text. |
number of pixels (Npx) from baseline |
Inline with the text, with the bottom of the image the specified number of pixels from the baseline. You can use positive or negative integers. For example, 10px is 10 pixels above the baseline, while -10px is 10 pixels below. |